<template>
  <div>
    <jxf-titletip :title="title" :hasRefresh="false" :hasGoBack="true" @goBack="$emit('goBack')"></jxf-titletip>
    <div class="jxf-content mt20">
      <el-card class="jxf-table-card mt10">
        <div slot="header" class="clearfix">
          <span>基本信息</span>
        </div>
        <div class="listArea">
          <jxf-datalist :info="dataInfo.basicInfo">
            <template slot="status" slot-scope="basicInfo">
              {{basicInfo.info.value == "0" ? "禁用" : "启用"}}
            </template>
          </jxf-datalist>
        </div>
      </el-card>
      <el-card class="jxf-table-card mt10">
        <div slot="header" class="clearfix">
          <span>补充信息</span>
        </div>
        <div class="listArea">
          <jxf-datalist :info="dataInfo.additionalInfo">
            <template slot="idCard" slot-scope="additionalInfo">
              {{additionalInfo.info.value ? additionalInfo.info.value.substring(0, 3) + '****' + additionalInfo.info.value.substring(additionalInfo.info.value.length - 4, additionalInfo.info.value.length) : ""}}
            </template>
            <template slot="cardNo" slot-scope="additionalInfo">
              {{additionalInfo.info.value ? additionalInfo.info.value.substring(0, 3) + '****' + additionalInfo.info.value.substring(additionalInfo.info.value.length - 4, additionalInfo.info.value.length) : ""}}
            </template>
          </jxf-datalist>
        </div>
      </el-card>
      <div class="btn-area">
        <!--<el-button type="primary" @click="resetPassword(dataInfo.id)">重置密码</el-button>-->
        <el-button type="danger" @click="freeze(dataInfo.id)" v-if="dataInfo.status === 1">禁用</el-button>
        <el-button type="danger" @click="unFreeze(dataInfo.id)" v-if="dataInfo.status === 0">启用</el-button>
      </div>
    </div>
  </div>
</template>

<script>
  export default {
    name: "SalemanDetail",
    props: {
      title: {
        type: String,
        default: "详情"
      },
      dataInfo: {
        type: Object,
        default: () => {}
      }
    },
    data() {
      return {

      }
    },
    methods: {
      resetPassword(id) {
        this.$confirm('此操作将重置该账户的密码, 是否继续?', '重置账户密码', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
          center: true
        }).then(() => {
          this.$message({
            type: 'success',
            message: '重置成功!'
          });
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消'
          });
        });
      },
      closeModel() {
        this.$emit('goBack')
      },
      // 冻结
      freeze(id) {
        let data = {
          userId: id,
          status: 0
        }
        this.$confirm('此操作将禁用该账户, 是否继续?', '', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          ajax.post(apis.architecture.changeUserStatus, data).then(res => {
            if(res.code == '10000000') {
              this.$message({
                type: 'success',
                message: '禁用成功!'
              });
              this.$emit('fresh')
              this.closeModel()
            } else {
              this.$message.error(res.message)
            }
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消'
          });
        });
      },
      unFreeze(id) {
        let data = {
          userId: id,
          status: 1
        }
        this.$confirm('此操作将启用该账户, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          ajax.post(apis.architecture.changeUserStatus, data).then(res => {
            if(res.code == '10000000') {
              this.$message({
                type: 'success',
                message: '启用成功!'
              });
              this.$emit('fresh')
              this.closeModel()
            } else {
              this.$message.error(res.message)
            }
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消'
          });
        });
      },
    }
  }
</script>

<style lang="scss" scoped>

</style>
